﻿@page "/jumbotrons"

<h1>Jumbotrons</h1>

<div class="docs-example">
    <BSJumbotron>
        <h1 class="display-4">Hello, world!</h1>
        <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
        <hr class="my-4">
        <p>It uses utility classes for typography and spacing to space content out within the larger container.</p>
        <BSButton Color=Color.Primary Size=Size.Large>Learn more</BSButton>
    </BSJumbotron>
</div>
<PrettyCode CodeFile="_content/SampleCore/snippets/jumbotrons/jumbotrons1.html" />

<h3>Fluid Jumbotron</h3>

<div class="docs-example">
    <BSJumbotron IsFluid="true">
        <BSContainer>
            <h1 class="display-4">Fluid jumbotron</h1>
            <p class="lead">This is a modified jumbotron that occupies the entire horizontal space of its parent.</p>
        </BSContainer>
    </BSJumbotron>
</div>
<PrettyCode CodeFile="_content/SampleCore/snippets/jumbotrons/jumbotrons2.html" />
